<!--
 * @Author: zi.yang
 * @Date: 2021-03-11 22:48:09
 * @LastEditors: zi.yang
 * @LastEditTime: 2021-03-11 23:57:12
 * @Description: In User Settings Edit
 * @FilePath: \vue-music\src\components\state\test-one.vue
-->

<template>
    <div>reactive 测试 ：{{ count }}</div>
</template>

<script>
import { reactive } from '@vue/composition-api';

export default {
  name: 'testOne',
  // vue3.0的入口函数, beforeCreate 之前进行触发
  setup() {
    const state = reactive({
      count: 0,
    });
    // 在 2020-09-18 日推出Vue3.0正式版之前，该方法不能表现出响应式
    setInterval(() => {
      // eslint 认为 一元运算符 state.count++ 是不安全的，所以禁止使用.
      state.count += 1;
    }, 1000);

    return state;
  },
};
</script>

<style scoped>
  div {
    color : red;
  }

</style>
